import React, { Component, Fragment } from 'react';
import { Card } from 'antd';
import {
  Row, Col,
} from 'antd';
import Mockjs from 'mockjs';
import TimerEnhance from '@/utils/TimerEnhance';
import LeftForm from './components/LeftForm';
import Result from './components/Result';
import styles from './index.less';

@TimerEnhance
class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      result: 0, // 0 -> well、1 -> bad
      loading: false,
    };
  }

  render() {
    const that = this;
    const {
      result,
      loading,
    } = this.state;
    const leftFormProps = {
      handleSubmit(values) {
        that.setState({
          loading: true,
          result: Mockjs.mock('@integer(0, 1)'),
        });

        that.setTimeout(() => {
          that.setState({
            loading: false,
          });
        }, 2000);
      },
    };
    const resultProps = {
      loading,
      result,
    };

    return (
      <Fragment>
        <Card bordered={false}>
          <Row>
            <Col xs={10}>
              <LeftForm {...leftFormProps} />
            </Col>
            <Col xs={8} offset={4} style={{ height: '100%' }}>
              <Result {...resultProps} />
            </Col>
          </Row>
        </Card>
        <Card>
          农户在此输入管理行为（整地、施肥、播种、收割）、当前日期、温度、湿度，得到此行为是否合理的决策。
        </Card>
      </Fragment>
    );
  }
}

export default Index;
